<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>修改密码</title>
    <link rel="stylesheet" href="css/window.css">
</head>
<body>
<span class="close-btn" onclick="closeWindow()">&times;</span>
<main class="container">

    <div class="container-left">
        <div class="logo-container">
            <div class="header-container">
                <p><font size="8" color="white">工&nbsp;程&nbsp;软&nbsp;件&nbsp;研&nbsp;发&nbsp;中&nbsp;心</font></p>
            </div>
        </div>
        <div class="Qr-code-container">
            <img src="imgs/index/1.png" class="Qr-code">
        </div>
    </div>

    <!-- 表单 -->
    <div class="container-right">
        <form class="form" action="" method="get">
            <!-- 表单背景图 -->
            <div class="form__image"></div>
            <!-- 表单Logo -->
            <div class="form__logo" xmlns="http://www.w3.org/2000/svg" width="3044" height="840" viewBox="416.5 656.5 3044 840">
                ESDC
            </div>

            <!-- 电话号码 -- -->
            <div class="input">
                <input id="userphone" type="text" class="input__element" placeholder=" "/>
                <label class="input__label" for="userphone">电话号码</label>
            </div>

            <!-- 验证码 -- -->
            <div class="input">
                <input id="userCaptcha" type="text" class="input__element" placeholder=" "/>
                <label class="input__label" for="userCaptcha">验证码</label>
            </div>

            <!-- 验证码图片 -- -->
            <div class="input">
                <div class="captcha">
                    <img style="float: right;" id="checkCodeImage" src="http://localhost:8080/javaweb_project/checkCodeServlet">
                    <button type="button" id="changeImg" onclick="refreshCaptcha()">看不清？</button>
                </div>
            </div>

            <!-- 密码 -- -->
            <div class="input">
                <input id="userpassword" type="password" class="input__element" placeholder=" "/>
                <label class="input__label" for="userpassword">密码</label>
            </div>

            <div class="input">
                <input id="userpassword2" type="password" class="input__element" placeholder=" "/>
                <label class="input__label" for="userpassword2">确认密码</label>
            </div>
            <button type="button" class="button">
                <div class="button__label" onclick="submitChange()">确认</div>
                <div class="button__icon"></div>
            </button>
            <div class="special-word" style="text-align: right;">
                <a href="javascript:void(0);" onclick="switchTologin()">登录</a> | <a href="javascript:void(0);" onclick="switchToRegistration()">注册</a>
            </div>
        </form>
    </div>
</main>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<script src="js/window.js"></script>
<script>
  function submitChange(){
      const telephone = document.getElementById('userphone').value;
      const password = document.getElementById('userpassword').value;
      const password2=document.getElementById('userpassword2').value;
      const captcha = document.getElementById('userCaptcha').value;
      // 构造请求数据
      const requestData = `telephone=${encodeURIComponent(telephone)}&password=${encodeURIComponent(password)}&password2=${encodeURIComponent(password2)}&captcha=${encodeURIComponent(captcha)}`;

      axios({
          method: "post",
          url: "http://localhost:8080/javaweb_project/user/changePassword",
          headers: {
              "Content-Type": "application/x-www-form-urlencoded"
          },
          data: requestData

      }).then(function (response) {
          // 处理响应
          console.log(response.data);
          if (response.data === 'updateSucceed') {
              alert("修改成功，请前往登录!");
              closeWindow();
              window.parent.postMessage({ action: 'loginSuccess', username: username }, '*');// 发送消息给父窗口
              localStorage.setItem('username', username); // 设置用户名到localStorage,用来存储用户登录状态
              window.parent.updateUserInfoForParent(username); // 直接调用父页面的更新函数
          } else if (response.data === 'captchaWrong') {
              alert("验证码错误")
          } else if (response.data === 'telephoneIsEmpty') {
              alert("电话号码不能为空")
          }else if(response.data==='userCaptchaIsEmpty'){
              alert("验证码不能为空")
          }else if(response.data==='userisNotFound'){
              alert("未找到改用户，请前往注册")
          }else if(response.data==='passwordIsEmpty'){
              alert("密码不能空")
          }else if(response.data==='password2IsEmpty'){
              alert("请确认密码")
          }else if(response.data==='passwordNotSame'){
              alert('两次密码输入不一致')
          }
      }).catch(function (error) {
          // 处理错误
          console.error('Error during login:', error);
          document.getElementById("username_err").style.display = '';
          alert('修改密码过程中出现了错误，请再试一次!');
      });
  }

</script>
</body>
</html>